{% extends "admin/base.html" %}
{% load static baton_tags %}
{% load i18n %}
{% block title %}
    {% if subtitle %}{{ subtitle }} |{% endif %}
    {{ title }} | {{ site_title|default:_("Django site admin") }}
{% endblock title %}
{% block extrahead %}
    {{ block.super }}
    {% baton_config as conf %}
    {{ conf | json_script:"baton-config" }}
    <script charset="utf-8">
        (function () {
            // immediately set the theme mode to avoid flashes
            var systemTheme = window.matchMedia("(prefers-color-scheme: dark)");
            var theme = JSON.parse(document.getElementById('baton-config').textContent).forceTheme || localStorage.getItem('baton-theme') || (systemTheme.matches ? 'dark' : 'light');
            document.getElementsByTagName('html')[0].setAttribute('data-bs-theme', theme);
        })()
    </script>
    <meta content="width=device-width, initial-scale=1.0" name="viewport" />
    <link rel="preload" href="https://fonts.gstatic.com/s/materialsymbolsoutlined/v247/kJEhBvYX7BgnkSrUwT8OhrdQw4oELdPIeeII9v6oFsI.woff2" as="font" type="font/woff2" crossorigin>
    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200" />
    <style>
    .material-symbols-outlined {
      font-size: 22px;
      line-height: 0;
      vertical-align: middle;
      font-variation-settings:
      'FILL' 0,
      'wght' 400,
      'GRAD' 0,
      'opsz' 24
    }
    .material-symbols-outlined:hover {
      text-decoration: none;
    }
    </style>
    <script src="{% static 'baton/app/dist/baton.min.js' %}"></script>
    <!-- <script src="http://localhost:8080/static/baton/app/dist/baton.min.js"></script> -->

    <script>
        (function () {
            // Get a list of fieldIds of all the editor managed fields, should return an array of ids
            Baton.AI.getEditorFieldsHook = function () {
              // i.e. for tinyMCE
              return window.tinyMCE ? window.tinyMCE.get().map((f) => f.id) : []
            }

            // Given a field id return the field value and null or undefined if field id is not an editor field
            Baton.AI.getEditorFieldValueHook = function (fieldId) {
              // i.e. for tinyMCE
              return window.tinyMCE ? window.tinyMCE.get(fieldId)?.getContent() : null
            }

            // Given a field id and a new value should set the editor field value if it exists and return true
            // should return false if the field is not an editor field
            Baton.AI.setEditorFieldValueHook = function (fieldId, value) {
              // i.e. for tinyMCE
              if (window.tinyMCE && window.tinyMCE.get(fieldId)) {
                window.tinyMCE.get(fieldId).setContent(value)
                return true
              }
              return false
            }

            // Given a field id should render the given checkmark icon to indicate the field is correct if it exists and return true,
            // should return false if the field is not an editor field
            Baton.AI.setEditorFieldCorrectHook = function (fieldId, icon) {
              // i.e. for tinyMCE
              if (window.tinyMCE && window.tinyMCE.get(fieldId)) {
                Baton.jQuery(`#${fieldId}`).parent().after(icon) // this uses jQuery
                return true
              }
              return false
            }
        })()
    </script>

    <script src="{% static 'baton/js_snippets/init_baton.js' %}"></script>
    {% baton_theme %}
    {% if LANGUAGE_BIDI %}
        <link rel="stylesheet" type="text/css" href="{% static 'admin/css/rtl.css' %}">
        <script src="{% static 'baton/js_snippets/rtl.js' %}"></script>
    {% endif %}
{% endblock extrahead %}

{% block branding %}
    <div class="baton-startup-overlay"></div>
    <h1 id="site-name">
        <a href="{% url 'admin:index' %}">{{ site_header|default:_("Django administration") }}</a>
    </h1>
{% endblock branding %}
{% block nav-global %}
{% endblock nav-global %}
{% block footer %}
    {% footer %}
{% endblock footer %}
